﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
    <script type="text/javascript" src="/js/echarts.min.js"></script>
</head>
<body>
      <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <div id="main2" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '数据统计'
            },
            tooltip: {},
            legend: {
                data: ['销量']
            },
            xAxis: {
                data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
            },
            yAxis: {},
            series: [{
                name: '销量',
                type: 'bar',
                data: [5, 20, 36, 10, 10, 20]
            }]
        };
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);


 var myCharttwo = echarts.init(document.getElementById('main2'));
var optiontwo={
  xAxis: {},
  yAxis: {},
  series: [
    {
      symbolSize: 20,
      data: [
        [10.0, 8.04],
        [8.07, 6.95],
        [13.0, 7.58],
        [9.05, 8.81],
        [11.0, 8.33],
        [14.0, 7.66],
        [13.4, 6.81],
        [10.0, 6.33],
        [14.0, 8.96],
        [12.5, 6.82],
        [9.15, 7.2],
        [11.5, 7.2],
        [3.03, 4.23],
        [12.2, 7.83],
        [2.02, 4.47],
        [1.05, 3.33],
        [4.05, 4.96],
        [6.03, 7.24],
        [12.0, 6.26],
        [12.0, 8.84],
        [7.08, 5.82],
        [5.02, 5.68]
      ],
      type: 'scatter'
    }
  ]
};
 // 使用刚指定的配置项和数据显示图表。
        myCharttwo.setOption(optiontwo);

    </script>
    <script>
    
        function loadData()
        {
           jQuery.ajax({
                        type: "post",
                        url: "GetDataAjax,
                        dataType: "json",
                        data: { "catalogId": 100},
                        success: function (data) {
                        if (data.success) {
                               // 填入数据
                               myChart.setOption({
                               xAxis: {
                                    data: data.categories
                                },
                               series: [{
                                   // 根据名字对应到相应的系列
                                   name: '销量',
                                   data: data.data
                                }]
                              });
                         }
                         alert(data.msg);
                        },
                        error: function () { alert("error"); }
                    });
        }
    
    </script>
</body>
</html>






